<script setup lang="ts"></script>

<template>
  <div class="header">
    <div class="h-left">
      <router-link to="/" active-class="active">笔记</router-link>
    </div>
    <div class="h-right">
      <router-link to="/todo" active-class="active">待办</router-link>
    </div>
  </div>
</template>

<style lang="scss" scoped>
.header {
  height: 0.6rem;
  display: flex;
  font-size: 0.2rem;
  align-items: center;
  padding: 0 0.1rem;
  box-sizing: border-box;
  .h-left,
  .h-right {
    width: 0.5rem;
    text-align: center;
    a {
      color: #ccc;
      &.active {
        color: rgb(25, 25, 25);
      }
    }
  }
}
</style>
